<!DOCTYPE html>
<html>
<head>
    <script src="../build/react.js"></script>
    <script src="../build/react-dom.js"></script>
    <script src="../build/browser.min.js"></script>
</head>
<body>
<div id="example"></div>
<script type="text/babel">

    class ReactComponent extends React.Component {
        render() {
            return <h1>React.Component</h1>;
        }
    };

//    class ReactPureComponent extends React.PureComponent {
//        render() {
//            return <h1>"React.PureComponent"</h1>;
//        }
//    }

    const createEle = React.createElement(
        "div",
        {
            name:"createElement"
        },
        <h1>React.createElement</h1>
    );

    const cloneEle = React.cloneElement(
        createEle,
        null,
            <h1>React.cloneElement</h1>
    );

    const createFac = React.createFactory("div");

    var isValidEle = React.isValidElement(createEle);

    ReactDOM.render(
        <div>
            <ReactComponent/>
            {createEle}
            {cloneEle}
            {createFac}
            isValidEle : {isValidEle?"Yes":"No"}
        </div>,
        document.getElementById("example")
    );
</script>
</body>
</html>

